//
//  TestPage1SwiftUI.swift
//  swiftUITest
//
//  Created by mac on 2024/5/17.
//

import SwiftUI
import Foundation

struct TestPage1SwiftUI: View {
    
    @State var showAlert = false
    @State var showActionSheet = false
    
    // 通过传递 父vc ，来做 页面 pop
    // https://stackoverflow.com/questions/75627630/how-to-push-viewcontroller-from-inside-uihostingcontrollers-swiftui-view-using
    @EnvironmentObject var parentNaviVC: RootSwiftController
    
    var body: some View {
        // VStack的两个View之间的间隔默认为10，可以通过参数(spacing)来控制间隔
        // VStack默认将视图 水平居中对齐, 可以使用alignment属性 更改 水平对齐方式
        VStack(alignment:.leading, spacing:24){
            
            // VStack的两个View之间的间隔默认为10，可以通过参数(spacing)来控制间隔
            // HStack默认将视图 垂直居中对齐, 可以使用alignment属性 更改 垂直对齐方式
            HStack(alignment:.bottom, spacing:20){
                Image("backArrow").onTapGesture {
                    self.showAlert = true
                }
                    .padding()// 无参数的padding，表示上下左右内边距为16
                    .border(.yellow, width: 1)
                    .alert(isPresented: $showAlert) {
                        Alert(title: Text("backClicked"),
                              message: Text("back image Clicked"),
                              primaryButton: .cancel(Text("取消"),
                                                     action: {
                            self.showAlert = false
                        }),
                              secondaryButton: .default(Text("确定"),
                                                        action: {
                            self.showAlert = false
                            
                            self.parentNaviVC.navigationController?.popViewController(animated: true)
                            
                        }))
                    }
//                Spacer()
                Image("backArrow").onTapGesture {
                    self.showActionSheet = true
                }
                    .padding(8)// 单参数的padding，表示上下左右内边距为 x
                    .border(.yellow, width: 1)
                    .actionSheet(isPresented: $showActionSheet, content: {
                        ActionSheet(title: Text("Title"),
                                    message: Text("Message"),
                                    buttons:
                            [.default(Text("Default"), action: {
                                print("Default")
                                self.showActionSheet = false
                            }),
                             .destructive(Text("destructive"), action: {
                                print("destructive")
                                self.showActionSheet = false
                            }),
                             .cancel({
                                print("Cancel")
                                self.showActionSheet = false
                            })])
                    })
                Text("定时清理聊天记录")
                    .padding(EdgeInsets(top:32, leading: 24, bottom: 16, trailing: 8))// EdgeInsets 参数的padding, 可以分别设置上左下右内边
                    .border(.yellow, width: 1)
//                Spacer()
                
            }
            .border(.green, width: 2)
            
            VStack{
                ZStack {
                    Text("")
                        .frame(width:72, height:72)
                        .background(.gray)
                        .cornerRadius(36)
                        .border(.red, width: 1)
                    Image("deleteIcon")
                        .border(.red, width: 1)
                }.padding(EdgeInsets(top:32, leading: 0, bottom: 0, trailing: 0))
                    .border(.green, width: 1)
                    .border(.yellow, width: 1)
                Divider()
                    .foregroundColor(.red) // Just add a line.
                Text("清空全部聊天记录")
                    .multilineTextAlignment(.center)
                    .padding(EdgeInsets(top:16, leading: 0, bottom: 0, trailing: 0))
                    .border(.yellow, width: 1)
                Text("被清空的聊天记录将无法恢复，请再次确认是否清空所有个人和群的聊天记录")
                    .multilineTextAlignment(.center)
                    .padding(EdgeInsets(top:8, leading: 32, bottom: 32, trailing: 32))
                    .border(.yellow, width: 1)
            }.background(.white)
                .cornerRadius(12) // 如果先call padding，再call cornerRadius，圆角将加到 padding 上没有效果
                .padding()
                .border(.green, width: 2)
            
            //在使用 SwiftUI 进行开发的过程中，Color、Rectangle 等经常被用来实现对容器的等分操作。另外，由于 Color、Rectangle 会在两个维度进行填充（ Spacer 会根据容器选择填充维度 ），因此，使用它们作为填充物时，将会自动使用全部的可用空间（ 包括高度 ），无需通过 .frame(maxHeight: .infinity) 应对给定尺寸不明的场景。
            // 把多個 Color 擺在一起，它們會自動平均分配空間
            
            //https://www.ethanhuang13.com/p/swiftui-4-not-just-color
            // Color 是 View，有排版特性，會填滿範圍
            // 多個 Color 擺在一起時，會平分空間
            // 搭配 .overlay 很好用
            // .foregroundColor 與 .background 不是一對。傳入 Color 時，前者會拿來當顏色用，後者會拿來當 View 使用
            // .overlay 與 .background 才是一對
            // 在 V/HStack 中，Color 會往兩軸填滿、Spacer() 只會在單軸做留白
            
//            HStack {
//                Spacer()
//                Color.white.overlay {
//                    Button(action: {
//                        // 您的按钮行为发生的地方
//                        
//                        let page2VC = TestSwiftUIViewManage().makePage2(self.parentNaviVC)
//                        self.parentNaviVC.navigationController?.pushViewController(page2VC, animated: true)
//                    }) {
//                        Text("清空全部")
//                    }.foregroundColor(.red)
//                        
//                }.frame(maxHeight: 40)
//                Spacer()
//            }.background(.white)
//                .padding(EdgeInsets(top:0, leading: 16, bottom: 0, trailing: 16))
//                .border(.green, width: 2)
//                .shadow(radius: 5, x: 2, y: 5)
            
            // 一个 沾满屏宽，带圆角的 button
            Button(action: {
                // 您的按钮行为发生的地方
                
                let page2VC = TestSwiftUIViewManage().makePage2(self.parentNaviVC)
                self.parentNaviVC.navigationController?.pushViewController(page2VC, animated: true)
            }) {
                HStack {
                    Spacer(minLength: 0)
                    Text("清空全部").padding(8)
                    Spacer(minLength: 0)
                }
            }.foregroundColor(.red)
                .background(.white)
//                .clipShape(Capsule())
                .cornerRadius(12)
                .padding(EdgeInsets(top:0, leading: 16, bottom: 0, trailing: 16))
                .border(.green, width: 2)
            
            // 5行简单列表
            List(0..<5) { item in
                Text("full Clean")
            }
            
            Spacer()
            
        }
        .background(.gray)
//        .navigationBarTitle(Text("定时清理聊天记录"), displayMode: .inline)
        .navigationBarHidden(true)
    }
}

#Preview {
    TestPage1SwiftUI()
}



